<template>
  <el-dialog :visible.sync="isShow" v-if="isShow" title="房间机器人表信息" width="65%" :before-close="handleClose" top="50px" :close-on-click-modal="false">
  <!-- 房间机器人表 -->
  <div class="app-container" style="height: 70vh;overflow: auto;">
    <div class="app-wrap">
      <search-table ref="table" :table-loading="listLoading" :table-data="roomRobotDataList" @query="getRoomRobotList" @reset="refresh">
        <template v-slot:row></template>
        <template v-slot:actions>
          <el-button type="primary" v-permission="'room.add'" size="mini" icon="el-icon-plus" 
          @click="addRoomRobot">新增机器人预设</el-button>
          <el-button type="info" size="mini" icon="el-icon-refresh" @click="refresh">刷新</el-button>
        </template>
        <template>
          <el-table-column align="center" type="index" width="50">
            <template slot-scope="scope">
              <el-radio v-model="scope.row.isChecked" :label="true" @change="handleCurrentChange(scope.row)">{{ "" }}</el-radio>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="id" label="ID" width="80" />
          <el-table-column align="center" prop="a_base_room_id" label="房间ID" width="80"/>
          <el-table-column align="center" prop="a_base_robot_id" label="机器人ID" width="80"/>
          <el-table-column align="center" prop="a_robot_remark" label="是否默认" width="100">
            <template slot-scope="scope">
              <el-tag effect="plain" type="success" v-show="scope.row.is_default==1">默认</el-tag>
              <el-tag effect="plain" type="info" v-show="scope.row.is_default==0">否</el-tag>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="a_robot_remark" label="机器人备注" />
          <el-table-column align="center" prop="a_robot_join_select" label="注入选中概率" width="120">
            <template slot-scope="scope">
              <span>{{ $public.keepFour(scope.row.a_robot_join_select/100) }}%</span>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="a_robot_kill_select" label="杀率触发概率" width="120">
            <template slot-scope="scope">
              <span>{{ $public.keepFour(scope.row.a_robot_kill_select/100) }}%</span>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="a_robot_exit_rate" label="非杀率退出等待概率" width="150">
            <template slot-scope="scope">
              <span>{{ $public.keepFour(scope.row.a_robot_exit_rate/100) }}%</span>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="operation" label="操作" width="150">
            <template slot-scope="scope">
              <el-tooltip effect="dark" v-permission="'room.edit'" content="编辑" placement="top-start">
                <el-button size="mini" type="warning" @click.stop="editItem(scope.row)"><i class="el-icon-edit-outline" /></el-button>
              </el-tooltip>
              <el-tooltip effect="dark" v-permission="'room.edit'" content="删除" placement="top-start">
                <el-button size="mini" type="danger" @click.stop="deleteItem(scope.row)"><i class="el-icon-delete" /></el-button>
              </el-tooltip>
            </template>
          </el-table-column>
        </template>
        <template v-slot:footer>
          <pagination  :total="currentTotal" :page.sync="listQuery.page" :limit.sync="listQuery.size" @pagination="getRoomRobotList" />
        </template>
      </search-table>
    </div>
    <!-- 新增房间机器人 -->
    <el-dialog :visible.sync="isRobotShow" v-if="isRobotShow" title="预设机器人" width="50%" top="50px" :close-on-click-modal="false" :append-to-body="true">
      <el-form ref="robotForm" :model="formParams" :rules="ruleForm" label-position="left">
        <el-form-item label="选择机器人:" prop="a_base_robot_id">
          <el-select v-model="formParams.a_base_robot_id" placeholder="请选择机器人"  filterable>
            <el-option v-show="item.game_id==listQuery.game_id" :label="item.a_robot_remark" :value="item.a_base_robot_id" v-for="(item, index) in robotDataList" :key="index"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="备注:" prop="a_robot_remark">
          <el-input class="width40" type="text" v-model="formParams.a_robot_remark" clearable placeholder="请输入备注"></el-input>
        </el-form-item>
        <el-form-item label="默认机器人:" prop="is_default">
          <el-radio-group v-model="formParams.is_default">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="注入选中概率:" prop="a_robot_join_select">
          <el-input-number :min="0" :max="10000" :precision="0" v-model="formParams.a_robot_join_select" controls-position="right" clearable placeholder="请输入机器人注入选中概率"/>%<span class="colorRed">(万分比)</span>
        </el-form-item>
        <el-form-item label="杀率选中概率:" prop="a_robot_kill_select">
          <el-input-number :min="0" :max="10000" :precision="0" v-model="formParams.a_robot_kill_select" controls-position="right" clearable placeholder="请输入机器人杀率选中概率"/>%<span class="colorRed">(万分比)</span>
        </el-form-item>
        <el-form-item label="非杀率退出等待概率:" prop="a_robot_exit_rate">
          <el-input-number :min="0" :max="10000" :precision="0" v-model="formParams.a_robot_exit_rate" controls-position="right" clearable placeholder="请输入机器人非杀率退出等待概率"/>%<span class="colorRed">(万分比)</span>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="medium" @click="isRobotShow = false">取 消</el-button>
        <el-button size="medium" type="primary" @click="handleConfirm('robotForm')">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</el-dialog>
</template>

<script>
import { throttle } from "@/utils/index";
import { 
  getRoomRobot, 
  delRoomRobot,
  addRoomRobot,
  editRoomRobot,
  allRobot
} from "@/api/game";
import SearchTable from "@/components/SearchTable";
export default {
  name: "roomRobot",
  components: {
    SearchTable,
  },
  props: {
    show: {
      type: Boolean,
      default: false
    },
    data: {
      type: Object,
      default: function () {
        return {}
      }
    },
  },
  data () {
    return {
      isShow:false,
      isRobotShow:false,
      roomRobotDataList: [],
      robotDataList: [],
      checkedItem: null,
      listLoading: false,
      currentTotal: 0,
      formParams:{
        game_id:1,
        a_base_room_id:0,
        a_base_robot_id:'',
        is_default:0,
        a_robot_remark:'',
        a_robot_join_select:'',
        a_robot_kill_select:'',
        a_robot_exit_rate:'',
      },
      listQuery: {
        page: 1,
        size: 50,
        a_base_room_id:0,
        game_id:0,
      },
      ruleForm:{
        a_base_robot_id: [{ required: true, trigger: 'blur', message: '请选择机器人', }],
        a_robot_join_select: [{ required: true, trigger: 'blur', message: '请输入机器人注入选中概率', }],
        a_robot_kill_select: [{ required: true, trigger: 'blur', message: '请输入机器人杀率选中概率', }],
        a_robot_exit_rate: [{ required: true, trigger: 'blur', message: '请输入机器人非杀率退出等待概率', }],
      }
    };
  },
  watch: {
    show: function () {
      let that = this;
      that.isShow = that.show
      if (that.data) {
        that.listQuery.game_id=JSON.parse(JSON.stringify(that.data)).game_id
        that.listQuery.a_base_room_id=JSON.parse(JSON.stringify(that.data)).a_base_room_id

        that.formParams.game_id=JSON.parse(JSON.stringify(that.data)).game_id
        that.formParams.a_base_room_id=JSON.parse(JSON.stringify(that.data)).a_base_room_id

        that.getRobotList();
        that.getRoomRobotList();
      }
    },
  },
  mounted () {},
  methods: {
    // 获取房间机器人列表
    getRoomRobotList () {
      let that = this;
      that.roomRobotDataList = [];
      that.checkedItem = null;
      that.listLoading = true;
      getRoomRobot(that.listQuery).then(function (res) {
        if (res.data) {
          res.data.list.forEach((item) => {
            item.isChecked = false;
          });
          that.currentTotal = res.data.total;
          that.roomRobotDataList = res.data.list;
        }
        that.listLoading = false;
      })
      .catch((error) => {
        that.listLoading = false;
        that.$message.error(error.msg);
      });
    },
    // 获取所有TeenPatti机器人
    getRobotList () {
      let that = this;
      that.robotDataList = [];
      allRobot().then(function (res) {
        if (res.data) {
          that.robotDataList = res.data
        }
      })
      .catch((error) => {
        that.$message.error(error.msg);
      });
    },
    // 新增机器人
    addRoomRobot(){
      this.formParams = {
        game_id:1,
        a_base_room_id:0,
        a_base_robot_id:'',
        is_default:0,
        a_robot_remark:'',
        a_robot_join_select:'',
        a_robot_kill_select:'',
        a_robot_exit_rate:'',
      }
      this.formParams.game_id=JSON.parse(JSON.stringify(this.listQuery)).game_id
      this.formParams.a_base_room_id=JSON.parse(JSON.stringify(this.listQuery)).a_base_room_id
      this.isRobotShow = true
    },
    // 编辑
    editItem (row) {
      let that = this;
      that.isRobotShow = true;
      that.formParams = row;
      that.handleCurrentChange(row);
    },
    // 删除
    deleteItem (row) {
      let that = this;
      that.handleCurrentChange(row);
      that.$confirm(`是否删除【${row.a_robot_remark}】房间机器人`, "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
      }).then(() => {
          delRoomRobot({
            id: row.id,
          }).then(function (res) {
            that.getRoomRobotList();
            that.$message({
              type: "success",
              message: "删除成功!",
            });
          });
        })
        .catch(() => { });
    },
    // 选择表格数据
    handleCurrentChange (val) {
      this.checkedItem = val;
      this.roomRobotDataList.map((item) => {
        if (item.id === val.id) {
          item.isChecked = true;
        } else {
          item.isChecked = false;
        }
      });
    },
    // 隐藏详情
    onHideDetails (show) {
      this.isRobotShow = false;
      if (show) {
        this.getRoomRobotList();
      }
    },
    // 刷新
    refresh: throttle(function () {
      this.listQuery.page=1
      this.listQuery.size=50
      this.getRoomRobotList();
    }, 2000),
    // 取消
    handleClose () {
      this.$emit('onHideDetails', false)
    },
    // 确认
    handleConfirm(formvalue){
      let that = this, params = JSON.parse(JSON.stringify(that.formParams));
      that.$refs[formvalue].validate((valid) => {
        if (valid) {
          // 新增
          if (!params.id) {
            addRoomRobot(params).then(function (res) {
              that.$message.success(res.msg)
              that.isRobotShow = false;
              that.getRoomRobotList()
            }).catch((error) => {
              that.$message.error(error.msg)
            })
          } else {
            editRoomRobot(params).then(function (res) {
              that.$message.success(res.msg)
              that.isRobotShow = false;
              that.getRoomRobotList()
            }).catch((error) => {
              that.$message.error(error.msg)
            })
          }
          
        } else {
          return false;
        }
      });
    }
  },
};
</script>

<style lang="scss" scoped></style>
